<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Access-Control-Allow-Origin" content="*" />
		<title>注册</title>
		<style>
			*{
				/* padding: 0;
				margin: 0; */
				list-style: none;
			}
			
		</style>
	</head>
	<body>

		<ul id="View_Register_Main">
			<li>
				<input type="text" placeholder="请输入密码" v-model="pwd" />
			</li>
			<li>
				<input type="text" placeholder="请输入邮箱" v-model="mail" />
			</li>
			<li>
				<input type="text" placeholder="邮箱验证码" v-model="code" />
				<button @click="GetMailCodeBut">获取邮箱验证码</button>
			</li>
			<li>
				<button @click="RegisterBut">注册</button>
			</li>
		</ul>

		<script src="../javaScript/vue.js"></script>
		<script src="../javaScript/jquery-3.5.1.min.js"></script>
		<script>
			var View_Register_Main_Vue = new Vue({
				el: "#View_Register_Main",
				data: {
					pwd: "",
					mail: "",
					code: ""
				},
				methods: {
					//获取邮箱验证码
					GetMailCodeBut() {
						if (this.mail == "") {
							console.log("请输入邮箱");
							return;
						}
						var vueThis = this;
						$.get("https://localhost:44356/api/Account/MailCode", {
							Mail: vueThis.mail
						}, function(data) {
							console.log(data);
						})
					},
					//注册
					RegisterBut() {
						if (this.mail == "" || this.pwd == "") {
							console.log("请输入邮箱或验证码");
							return;
						}
						var vueThis = this;
						$.post("https://localhost:44356/api/Account/Register", {
							Pwd : vueThis.pwd,
							Mail : vueThis.mail,
							Code : vueThis.code
						}, function(data) {
							console.log(data);
						})
					}
				}
			});
		</script>
	</body>
</html>
